import { createApp } from "vue";
import router from "./router";
import store from "./store/index";
// import amplitude from "amplitudejs"
import { createTheme, getClientLocalTheme } from "./services/theme";
// import { createMusic } from "./services/music";
import { createGlobalState } from "./state";
import { isClient } from "./environment";
import App from "./App.vue";
import Placeholder from "./components/common/placeholder";
import "@/styles/app.scss";
import { enableCopyRight } from "@/services/copyright";
import "./services/swiper";

const app = createApp(App);

const themeValue = getClientLocalTheme();

const theme = createTheme(themeValue);

const config = isClient && navigator;

// const music = createMusic({ amplitude, autoStart: true })
const globalState = createGlobalState(config);

app.use(router);
app.use(store);
app.use(theme);
// app.use(music);
app.use(globalState);
app.component(Placeholder.name, Placeholder);

theme.bindClientSystem();


app.mount("#app").$nextTick(() => {
  enableCopyRight();
})